{extend name="index/base" /}
{block name='title'}Page Not Found{/block}
{block name='platform_description'}Not Found{/block}
<!--  样式  -->
{block name="style"}<style>
		body {
	    	background-color: #ffffff;
	    }
	    .error .clip .shadow {
	        height: 180px;
	    }
	    .text-center {text-align: center;}

	    .error .clip:nth-of-type(2) .shadow {
	        width: 130px;
	    }

	    .error .clip:nth-of-type(1) .shadow,
	    .error .clip:nth-of-type(3) .shadow {
	        width: 250px;
	    }

	    .error .digit {
	        width: 150px;
	        height: 150px;
	        line-height: 150px;
	        font-size: 120px;
	        font-weight: bold;
	    }
	
	    .error {margin: 10% 0;}

	    .error h2 {
	        font-size: 32px;
	    }

	    .error .msg {
	        top: -190px;
	        left: 30%;
	        width: 80px;
	        height: 80px;
	        line-height: 80px;
	        font-size: 32px;
	    }

	    .error span.triangle {
	        top: 70%;
	        right: 0%;
	        border-left: 20px solid #535353;
	        border-top: 15px solid transparent;
	        border-bottom: 15px solid transparent;
	    }

	    .error .container-error-404 {
	        position: relative;
	        height: 250px;
	        padding-top: 40px;
	    }

	    .error .container-error-404 .clip {
	        display: inline-block;
	        transform: skew(-45deg);
	    }

	    .error .clip .shadow {
	        overflow: hidden;
	    }

	    .error .clip:nth-of-type(2) .shadow {
	        overflow: hidden;
	        position: relative;
	        box-shadow: inset 20px 0px 20px -15px rgba(150, 150, 150, 0.8), 20px 0px 20px -15px rgba(150, 150, 150, 0.8);
	    }

	    .error .clip:nth-of-type(3) .shadow:after,
	    .error .clip:nth-of-type(1) .shadow:after {
	        content: "";
	        position: absolute;
	        right: -8px;
	        bottom: 0px;
	        z-index: 9999;
	        height: 100%;
	        width: 10px;
	        background: linear-gradient(90deg, transparent, rgba(173, 173, 173, 0.8), transparent);
	        border-radius: 50%;
	    }

	    .error .clip:nth-of-type(3) .shadow:after {
	        left: -8px;
	    }

	    .error .digit {
	        position: relative;
	        top: 8%;
	        color: white;
	        background: #c71d32;
	        border-radius: 50%;
	        display: inline-block;
	        transform: skew(45deg);
	    }

	    .error .clip:nth-of-type(2) .digit {
	        left: -10%;
	    }

	    .error .clip:nth-of-type(1) .digit {
	        right: -20%;
	    }

	    .error .clip:nth-of-type(3) .digit {
	        left: -20%;
	    }

	    .error h2 {
	        font-size: 24px;
	        color: #555;
	        font-weight: bold;
	        padding-bottom: 20px;
	    }

	    .error .tohome {
	        font-size: 16px;
	        color: #c71d32;
	        display: inline-block;
	        margin: 0 20px;
	        padding: 4px 12px;
	        border-radius: 3px;
	        border:1px solid #c71d32;
	    }
	    .error .tohome:hover {
	        background-color: #c71d32;
	        color: #fff;
	    }

	    .error .msg {
	        position: relative;
	        z-index: 9999;
	        display: block;
	        background: #535353;
	        color: #A2A2A2;
	        border-radius: 50%;
	        font-style: italic;
	    }

	    .error .triangle {
	        position: absolute;
	        z-index: 999;
	        transform: rotate(45deg);
	        content: "";
	        width: 0;
	        height: 0;
	    }

	    @media(max-width: 767px) {
	        .error .clip .shadow {
	            height: 100px;
	        }
	        .error .clip:nth-of-type(2) .shadow {
	            width: 80px;
	        }
	        .error .clip:nth-of-type(1) .shadow,
	        .error .clip:nth-of-type(3) .shadow {
	            width: 100px;
	        }
	        .error .digit {
	            width: 80px;
	            height: 80px;
	            line-height: 80px;
	            font-size: 52px;
	        }
	        .error h2 {
	            font-size: 18px;
	        }
	        .error .msg {
	            top: -110px;
	            left: 15%;
	            width: 40px;
	            height: 40px;
	            line-height: 40px;
	            font-size: 18px;
	        }
	        .error span.triangle {
	            top: 70%;
	            right: -3%;
	            border-left: 10px solid #535353;
	            border-top: 8px solid transparent;
	            border-bottom: 8px solid transparent;
	        }
	        .error .container-error-404 {
	            height: 150px;
	        }
	    }
	</style> {/block}
<!-- 内容 -->
{block name="content"}
<div class="dowebok error">
    <div class="container-floud">
        <div class="col-xs-12 ground-color text-center">
            <div class="container-error-404">
                <div class="clip">
                    <div class="shadow">
                        <span class="digit thirdDigit">4</span>
                    </div>
                </div>
                <div class="clip">
                    <div class="shadow">
                        <span class="digit secondDigit">0</span>
                    </div>
                </div>
                <div class="clip">
                    <div class="shadow">
                        <span class="digit firstDigit">4</span>
                    </div>
                </div>
                <div class="msg">OH!
                    <span class="triangle"></span>
                </div>
            </div>
            <h2 class="h1">SORRY，PAGE NOT FOUND</h2>

        </div>
    </div>
</div>



{/block}
<!-- script -->
{block name="script"}

<!-- Vendor scrits: js libraries and plugins-->
<script src="/assets/js/bootstrap.bundle.min.js"></script>
<script src="/assets/js/tiny-slider.js"></script>
<script src="/assets/js/smooth-scroll.polyfills.min.js"></script>
<!-- Main theme script-->
<script src="/assets/js/theme.min.js"></script>


<script src="/assets/js/swiper.min.js"></script>

<script>

    layui.extend({
        fileUpload: 'vue-components/fileUpload',
    }).use(["fileUpload"], function (fileUpload) {
        initVue({
            data: {

            },
            components: {
                'file-upload': fileUpload
            },
            computed: {

            },
            created: function () {

            },
            mounted: function () {

            },
            methods: {

            },
        })


    })
</script>

{/block}